﻿@{
    ViewBag.Title = "Level";
}
@using MMS.UI.Extension;
@section headSection{
    <script src="/Scripts/echarts.js"></script>
   <script src="/Scripts/macarons.js"></script>
    @*会员等级分析表格*@
    <script type="text/javascript" >
       
        $(function () {
            $.globalHelper.datagridPara.init("/Admin/MembershipAnalysis/Level",
                [@Html.GetSonBtnJs()],
                [[
                { field: 'LName', title: '会员等级', width: 50, sortable: true },
                { field: 'Tid', title: '会员等级交易量', width: 50, sortable: true },
                { field: 'MaxMonetary', title: '最高交易金额', width: 50, sortable: true },
                { field: 'AVGMonetary', title: '平均交易金额', width: 50, sortable: true }
                ]]);

            
            $("#tbList").datagrid($.globalHelper.datagridPara.paras);
            
            $("#tbList").datagrid({
            })

        });
    </script>

<script type="text/javascript">
    //折线图堆叠
    $.post('/Admin/MembershipAnalysis/Level/', function (jsonText) {
        var myChart = echarts.init(document.getElementById('main'), 'macarons');
        var colors = ['#5793f3', '#d14a61', '#6F00D2'];
        myChart.setOption({
            color: colors,
            title: {
                text: '会员等级消费行为分析图'
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross'
                }
            },
            grid: {
                right: '20%'
            },
            toolbox: {
                feature: {
                    dataView: { show: true, readOnly: false },
                    restore: { show: true },
                    saveAsImage: { show: true }
                }
            },
            legend: {
                data: ['会员等级','交易量', '单次最高交易金额', '平均交易金额']
            },
            xAxis: [
                {
                    type: 'category',
                    name: '会员等级',
                    axisTick: {
                        alignWithLabel: true
                    },
                    data: []
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    name: '交易量',
                    min: 0,
                    max: 150,
                    position: 'left',
                    axisLine: {
                        lineStyle: {
                            color: colors[0]
                        }
                    },
                    axisLabel: {
                        formatter: '{value} '
                    }
                },
                {
                    type: 'value',
                    name: '单次最高交易金额',
                    min: 0,
                    max: 15000,
                    position: 'right',
                    offset: 60,
                    axisLine: {
                        lineStyle: {
                            color: colors[1]
                        }
                    },
                    axisLabel: {
                        formatter: '{value} 元'
                    }
                },
                {
                    type: 'value',
                    name: '平均交易金额',
                    min: 0,
                    max: 15000,
                    position: 'right',
                    offset: 145,
                    axisLine: {
                        lineStyle: {
                            color: colors[2]
                        }
                    }
                }
            ],
            series: [
                {
                    name: '交易量',
                    type: 'bar',
                    data: []
                },
                {
                    name: '单次最高交易金额',
                    type: 'bar',
                    yAxisIndex: 1,
                    data: []
                },
                  {
                      name: '平均交易金额',
                      type: 'bar',
                      yAxisIndex: 2,
                      data: []
                  }]
        });
        myChart.showLoading();
        var LName = [];
        var Tid = [];
        var maxMonetary = [];
        var aVGMonetary = [];
        


        if (typeof (jsonText) == "string") {
            try {
                jsonText = eval(jsonText);
            } catch (e) {
                try {
                    jsonText = eval("(" + jsonText + ")")
                } catch (e) {
                    alert("格式错误：必须为json格式字符串");

                }

            }

        }
        for (var i = 0; i < jsonText.length; i++) {

            LName[i] = jsonText[i].LName;
            Tid[i] = jsonText[i].Tid;
            maxMonetary[i] = jsonText[i].MaxMonetary;
            aVGMonetary[i] = jsonText[i].AVGMonetary;
        }

        myChart.hideLoading();

        myChart.setOption({

            xAxis: {
                data: LName
            },
            series: [
                { name: '交易量', data: Tid },
                { name: '单次最高交易金额', data: maxMonetary },
                { name: '平均交易金额', data: aVGMonetary }
            ]

        });
    });
</script>
    }
<table id="tbList"></table>
<div style="width: 100%;height:30px;"></div>
<div id="main" style="width: 100%;height:400px;"></div>

